{extend name='public/base' /}

{block name="style"}
{css href="/static/inspinia/css/plugins/switchery/switchery.css" /}
{/block}

{block name="breadcrumb"}
{$crumbs}
{/block}

{block name="body"}
<div class="col-lg-12">
    <div class="ibox float-e-margins">
        <div class="ibox-content">
            <button class="btn btn-primary btn-xs"><a href="{:url('save_product')}"><i class="fa fa-plus"></i> 添加产品</a> </button>
            <table class="table">
                <thead>
                <tr>
                    <th>ID</th>
                    <th>图片</th>
                    <th>名称</th>
                    <th>首页显示</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>
                {volist name="product" id="vo"}
                <tr>
                    <td>{$vo.id}</td>
                    <td>
                        <a class="element" href="javascript:;" data-html="true" data-content="<img src='/uploads/product/{$vo.image|default=''}' />" data-toggle="popover" data-trigger="click">
                            <img style="max-width: 30px; max-height: 30px;" src="/uploads/product/{$vo.image|default=''}" />
                        </a>
                    </td>
                    <td>{$vo.name}</td>
                    <td>
                        {eq name='vo.is_index' value='1'}
                        <i class="fa fa-check is_index" data-product-id="{$vo.id}" data-is-index="{$vo.is_index}" style="color: #1ab394; cursor: pointer;"></i>
                        {else /}
                        <i class="fa fa-times is_index" data-product-id="{$vo.id}" data-is-index="{$vo.is_index}" style=" cursor: pointer;"></i>
                        {/eq}
                    </td>
                    <td>
                        <button class="btn btn-info btn-xs"><a href="{:url('save_product', ['id' => $vo['id']])}"><i class="fa fa-edit"></i> 编辑</a> </button>
                        <button class="btn btn-danger btn-xs" data-kefu-id="{$vo.id}"><a href="javascript:;"><i class="fa fa-trash"></i> 删除</a> </button>
                    </td>
                </tr>
                {/volist}
                </tbody>
            </table>
        </div>
    </div>
</div>
{/block}

{block name="javascript"}
{js href="/static/inspinia/js/plugins/switchery/switchery.js" /}
<script>
    $(function () {
        var elem = document.querySelector('.js-switch');
        var switchery = new Switchery(elem, { color: '#1AB394' });

        $(document).on('click', '.is_index', function () {
            // 设置产品是否首页显示
            var _this = $(this);
            var id = _this.data('product-id');
            var is_index = _this.data('is-index') == 1 ? 0 : 1;
            $.get("{:url('save_product_index')}", {id: id, is_index: is_index}, function (msg) {
                if (msg.code == 200) {
                    if (is_index == 1) {
                        _this.parent().html('<i class="fa fa-check is_index" data-product-id="'+ id +'" data-is-index="1" style="color: #1ab394; cursor: pointer;"></i>');
                    } else {
                        _this.parent().html('<i class="fa fa-times is_index" data-product-id="'+ id +'" data-is-index="0" style=" cursor: pointer;"></i>');
                    }
                }else {
                    swal({
                        title: msg.msg,
                        type: "error"
                    });
                }
            }, 'json');
        });
    });
</script>
{/block}